<!--
 * @Title: 
 * @Description: 
 * @version: 
 * @Author: wzs
 * @Date: 2023-04-15 19:38:32
 * @LastEditors: wzs
 * @LastEditTime: 2023-04-17 09:30:22
-->
<template>
  <div class="button-bar">
    <download-button textFlag></download-button>
    <share-button textFlag></share-button>
    <rename-button
      v-if="multipleSelection.length === 1"
      textFlag
    ></rename-button>
    <copy-button textFlag></copy-button>
    <transfer-button textFlag></transfer-button>
    <delete-button textFlag></delete-button>
  </div>
</template>
<script>
import { mapGetters } from 'vuex'
import DownloadButton from '@/components/buttons/download-button/index.vue'
import ShareButton from '@/components/buttons/share-button/index.vue'
import RenameButton from '@/components/buttons/rename-button/index.vue'
import CopyButton from '@/components/buttons/copy-button/index.vue'
import TransferButton from '@/components/buttons/transfer-button/index.vue'
import DeleteButton from '@/components/buttons/delete-button/index.vue'

export default {
  components: {
    DownloadButton,
    ShareButton,
    RenameButton,
    CopyButton,
    TransferButton,
    DeleteButton,
  },
  computed: {
    ...mapGetters(['multipleSelection']),
  },
}
</script>
<style lang="scss" scoped>
.button-bar {
  position: fixed;
  left: 50%;
  bottom: 5%;
  background-color: rgba($color: #000000, $alpha: 0.8);
  margin-left: -97px;
  border-radius: 10px;
  padding-left: 10px;
  box-shadow: 0 0 50px #999;
}
</style>
